<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>页面加载中...</title>
</head>
<body>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title></title>
        <link rel="stylesheet" href="../static/assets/swiper/swiper-3.4.2.min.css">
        <link rel="stylesheet" href="../static/css/common/adaptor.css">
        <link rel="stylesheet" href="../static/css/common/common.css">
        <link rel="stylesheet" href="../static/css/product/product.css">
    </head>
    <body>
        <div class="layout">
            <!--商品详情头部-->
            <!-- <div class="header">商品详情</div> -->
            <!--轮播图-->
            <div class="productImg">
                <div class="swiper-container">
                    <!-- <div class="swiper-wrapper"> -->
                        <!--动态渲染-->
                    <!-- </div> -->
                    <!-- <div class="swiper-pagination"></div> -->
                </div>
            </div>
            <!--商品名称和价格-->
            <div class="product_Name">
                <!--动态渲染-->
            </div>
            <!--商品喜欢人数-->
            <div class="like">
                <!--动态渲染-->
            </div>
            <!--商品信息和评论-->
            <div class="msgAndcomments">
                <div class="btn">
                    <!-- <a class="msgAndcommentsBtn msg msgBtn" href="javascript:void(0);" index=1>商品详情</a>
                    <a class="msgAndcommentsBtn comments commentsBtn" href="javascript:void(0);" index=2>累计评价(16)</a> -->
                </div>
                <!--商品详情-->
                <div class="hideMsgOrComments productMsg productMsgOrComments">
                    <!-- <div class="productMsgContent"></div> -->
                </div>
                <!--商品评价-->
                <div class="hideMsgOrComments commentsContainer productMsgOrComments">
                    <div class="commentClassify">
                        <!--动态渲染评论分类按钮-->
                    </div>
                    <!--所有评论-->
                    <div class="hidecommentList allCommentList commentList">
                        <!--动态渲染所以评论-->
                    </div>
                    <!--好评-->
                    <div class="hidecommentList goodCommentList commentList">
                        <!--动态渲染好评-->
                    </div>
                    <!--中评-->
                    <div class="hidecommentList neutralCommentList commentList">
                        <!--动态渲染中评-->
                    </div>
                    <!--差评-->
                    <div class="hidecommentList badCommentList commentList">
                        <!--动态渲染差评-->
                    </div>
            </div>
            <!--商品详情页底部-->
        <div class="footer">
            <div class="howToBuy">请打开惊喜APP进行购买,如未安装惊喜APP,请去下载。</div>
                <div class="toDownLoadApp">去下载APP</div>
            </div>
        </div>
        <!--商品图片录播图-->
        <script type="text/template" id="productAutoImg">
            <div class="swiper-wrapper">
                {{each pics as item index}}
                <div class="swiper-slide"><img src="{{item}}"></div>
                {{/each}}
            </div>
            {{if pics.length > 1}}
            <div class="swiper-pagination"></div>
            {{/if}}
        </script>
        <!--商品名称及价格-->
        <script type="text/template" id="productMsgAndPrice">
            <div class="name">{{msg.productName}}</div>
            <div class="product_price">¥&nbsp;{{msg.price}}</div>
            <div class="diamondAndCash">钻石 :&nbsp;{{msg.diamond}}&nbsp;&nbsp;&nbsp;&nbsp;现金 :&nbsp;{{msg.diamondPrice}}</div>
            <div class="salesCount">已售<span>{{msg.salesCount}}</span>件</div>
        </script>
        <!--商品喜欢人数-->
         <script type="text/template" id="peopleLikeProduct">
            <div class="likeCout"><span>{{love.loveCount}}</span>人喜欢</div>
            <div class="userImg">
                <ul>
                    {{each love.loveList as item index}}
                    <li class="user"><img src="{{item}}" alt=""></li>
                    {{/each}}
                </ul>
            </div>
            <div class="thanks">谢谢你的喜欢</div>
            <div class="addClic">
                <div class="heart"></div>
            </div>
        </script> 
        <!--商品详细信息-->
        <script type="text/template" id="msgContent">
            {{each details as item index}}
            <img class="lazy" data-original="{{item}}" width="100%" alt="">
            {{/each}}
        </script>
        <!--商品详情和评价按钮-->
        <script type="text/template" id="btns">
            <span class="msgAndcommentsBtn msg msgBtn" index=1>商品详情</span>
            <span class="msgAndcommentsBtn comments commentsBtn" index=2>累计评价({{commentsNum}})</span> 
        </script>
        <!--商品评论分类按钮-->
        <script type="text/template" id="commentClassifyBtn">
            <ul>
                <li><span href="javascript:void(0);" class="commentItem" index=1>全部</span></li>
                <li><span href="javascript:void(0);" class="commentItem" index=2>好评({{allCommentNum.hao}})</span></li>
                <li><span href="javascript:void(0);" class="commentItem" index=3>中评({{allCommentNum.zhong}})</span></li>
                <li><span href="javascript:void(0);" class="commentItem" index=4>差评({{allCommentNum.cha}})</span></li>
            </ul>
        </script>
        <!--商品所有评论-->
        <script type="text/template" id="allCommentsTpl">
            {{if commenList.length>0}}
            {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                    <div class="userCommentMsg">
                        <div class="userName">{{item.nickname}}
                            {{if item.score===1}}
                            <span class="goodscore"></span>
                            {{/if}}
                            {{if item.score===0}}
                            <span class="neutralscore"></span>
                            {{/if}}
                            {{if item.score===-1}}
                            <span class="badscore"></span>
                            {{/if}}
                        </div>
                        <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}}
            {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <!--商品好评-->
        <script type="text/template" id="goodCommentsTpl">
            {{if commenList.length>0}}
            {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                    <div class="userCommentMsg">
                        <div class="userName">{{item.nickname}}
                            <span class="goodscore"></span>
                        </div>
                        <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}}
            {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <!--商品中评-->
        <script type="text/template" id="neutralCommentsTpl">
            {{if commenList.length>0}}
            {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                    <div class="userCommentMsg">
                        <div class="userName">{{item.nickname}}
                            <span class="neutralscore"></span>
                        </div>
                        <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}}
            {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <!--商品差评-->
        <script type="text/template" id="badCommentsTpl">
            {{if commenList.length>0}}
            {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                    <div class="userCommentMsg">
                        <div class="userName">{{item.nickname}}
                            <span class="badscore"></span>
                        </div>
                        <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}}
            {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <script src="../static/assets/jquery/jquery.min.js"></script>
        <script src="../static/assets/jquery-lazyload/jquery.lazyload.js"></script>
        <script src="../static/assets/art-template/template.js"></script>
        <script src="../static/assets/swiper/swiper-3.4.2.min.js"></script>
        <script src="../static/js/tools/tools.js"></script>
        <script src="../static/js/tools/config.js"></script>
        <script src="../static/js/product/product.js"></script>
    </body>
    </html>
</body>
</html>